להתאים אישית את חוויית המשתמש ללקוחות מוכרים

שימוש ב-worklet של Shared Storage כדי לזהות לקוחות מוכרים.

Shared Storage API הוא הצעה של ארגז החול לפרטיות לאחסון כללי באתרים שונים, שתומך במגוון תרחישי שימוש אפשריים. דוגמה אחת היא זיהוי לקוחות מוכרים, שזמין לבדיקה ב-Chrome מגרסה 104.0.5086.0 ואילך.

אתם יכולים לאחסן ב-Shared Storage את הנתון לגבי הרשמת המשתמש באתר, ואז להציג רכיב נפרד על סמך הסטטוס המאוחסן של המשתמש (האם המשתמש הוא לקוח "מוכר").

הגדרת לקוחות מוכרים

כדי להתנסות בזיהוי לקוחות מוכרים ב-Shared Storage, צריך לוודא שאתם משתמשים ב-Chrome בגרסה 104.0.5086.0 ואילך. מפעילים את כל ממשקי ה-API לשמירה על פרטיות בפרסום בקטע chrome://settings/adPrivacy.

אפשר גם להפעיל את האחסון המשותף באמצעות הדגל --enable-features=PrivacySandboxAdsAPIsOverride,OverridePrivacySandboxSettingsLocalTesting,SharedStorageAPI,FencedFrames בשורת הפקודה.

התנסות בדוגמאות קוד

יכול להיות שתרצו להציג רכיב אחר על סמך העובדה שהמשתמש נצפה באתר אחר. לדוגמה, ספק תשלומים עשוי להציג את הלחצן 'רישום' או 'קנייה עכשיו' בהתאם לכך שהמשתמש נרשם באתר של ספק התשלומים. אפשר להשתמש באחסון משותף כדי להגדיר את סטטוס המשתמש ולהתאים אישית את חוויית המשתמש שלו על סמך הסטטוס הזה.

בדוגמה הזו:

  • known-customer.js מוטמע במסגרת. הסקריפט הזה מגדיר את האפשרויות לגבי הלחצן שמוצג באתר, 'הרשמה' או 'קנייה עכשיו'.
  • known-customer-worklet.js הוא ה-worklet של האחסון השיתופי שקובע אם המשתמש ידוע. אם המשתמש ידוע, המידע מוחזר. אם המשתמש לא ידוע, המידע הזה מוחזר כדי להציג את הלחצן 'רישום', והמשתמש מסומן כידוע לעתיד.

known-customer.js

// The first URL for the "register" button is rendered for unknown users.
const BUTTON_URLS = [
  { url: `https://${advertiserUrl}/ads/register-button.html` },
  { url: `https://${advertiserUrl}/ads/buy-now-button.html` },
];

async function injectButton() {
  // Load the worklet module
  await window.sharedStorage.worklet.addModule('known-customer-worklet.js');

  // Set the initial status to unknown ('0' is unknown and '1' is known)
  window.sharedStorage.set('known-customer', 0, {
    ignoreIfPresent: true,
  });

  // Run the URL selection operation to choose the button based on the user status
  const fencedFrameConfig = await window.sharedStorage.selectURL('known-customer', BUTTON_URLS, {
    resolveToConfig: true
  });

  // Render the opaque URL into a fenced frame
  document.getElementById('button-slot').src = fencedFrameConfig;
}

injectButton();

known-customer-worklet.js

class SelectURLOperation {
  async run(urls) {
    const knownCustomer = await sharedStorage.get('known-customer');

    // '0' is unknown and '1' is known
    return parseInt(knownCustomer);
  }
}

register('known-customer', SelectURLOperation);

תרחישים לדוגמה

בקטע הזה מפורטים כל תרחישי השימוש הזמינים של Select URL API. נמשיך להוסיף דוגמאות ככל שנקבל משוב ונמצא תרחישי בדיקה חדשים.

יצירת מעורבות ושיתוף משוב

חשוב לדעת שההצעה ל-Select URL API נמצאת כרגע בשלבי פיתוח ודיון, והיא כפופה לשינויים.

נשמח לשמוע את דעתכם על Select URL API.

אפשר להתעדכן

  • רשימת תפוצה: תוכלו להירשם לרשימת התפוצה שלנו כדי לקבל את העדכונים וההודעות האחרונים לגבי ממשקי ה-API של Select URL ו-Shared Storage.

דרושה לך עזרה?